import React, {useContext, useState} from 'react';
import PubSub from 'pubsub-js'
import "../../css/frequency.css"
const Frequency = (props) =>{
    const [activeFre,setActiveFre] = useState('1D');
    const frequency = ['1D','1W','2W','1M','3M','6M','1Y','YTD'];
    const onClickFre = (fre)=>{
        setActiveFre(fre);
        // console.log("消息发布成功"+fre);
        //发布消息
        PubSub.publish('frequencyChange',{timeRange:fre});
    };
    return(
        <div className='fre-group'>
            {frequency.map((item)=>(
                <span key={item}
                      className={activeFre === item ? 'fre-item active' : 'fre-item'}
                      onClick={()=>onClickFre(item)}>
                    {item}
                </span>))}
        </div>
    );
}

export default Frequency